<template>
  <search-list :api-url="url.SaleUserCustomerList" :beforeQuery="beforeQuery" @getTotal="getTotal">
    <el-table-column prop="title" label="头像/昵称" show-overflow-tooltip>
      <template #="scope">
        <img :src="scope.row.avatar || ''" class="list-img" alt="" />
        {{ scope.row.nickname || '' }}
      </template>
    </el-table-column>
    <el-table-column
      prop="phone"
      label="手机号码"
      show-overflow-tooltip
      align="center"
    ></el-table-column>
    <el-table-column prop="payCnt" label="累计消费笔数" show-overflow-tooltip align="center">
      <template #="scope">{{ scope.row.payCnt }}笔</template>
    </el-table-column>
    <el-table-column prop="payAmount" label="累计消费金额" show-overflow-tooltip align="center">
      <template #="scope">{{ scope.row.payAmount }}元</template>
    </el-table-column>
    <el-table-column
      prop="payAmount"
      label="累计分佣（包含待结算）"
      show-overflow-tooltip
      align="center"
    >
      <template #="scope">{{ scope.row.saleAmount }}元</template>
    </el-table-column>
    <el-table-column
      prop="bindedAt"
      label="最新绑定时间"
      show-overflow-tooltip
      align="center"
    ></el-table-column>
    <el-table-column
      prop="createdAt"
      label="注册时间"
      show-overflow-tooltip
      align="center"
    ></el-table-column>
    <el-table-column prop="bind" label="当前是否绑定" show-overflow-tooltip align="center">
      <template #="scope">{{ scope.row.bind ? '是' : '否' }}</template>
    </el-table-column>
  </search-list>
</template>
<script>
  import { getCurrentInstance, onMounted, reactive, ref, watch, computed } from 'vue';
  import { ElMessage } from 'element-plus';
  // 这个就是事件总线哦
  import bus from '@/bus';
  export default {
    props: {
      type: {
        type: Number,
        default: null,
      },
      uuid: {
        type: String,
        default: '',
      },
    },

    setup(props, ctx) {
      const { type, uuid } = props;
      const {
        $url: url,
        $service: service,
        JSON_HEADER: JSON_HEADER,
        $selectFormat: selectFormat,
      } = getCurrentInstance().appContext.config.globalProperties;

      // data

      // methods
      // 搜索之前
      const beforeQuery = ({ searchInfo }) => {
        searchInfo.type = type;
        searchInfo.uuid = uuid;
      };
      // 得到总数
      const getTotal = (val) => {
        let _ = 'type' + '-' + type + ':' + val;
        bus.$emit('getTotal', _);
      };
      // life
      onMounted(() => {});

      return {
        url,
        service,
        JSON_HEADER,
        selectFormat,
        // data
        // methods
        beforeQuery,
        getTotal,
      };
    },
  };
</script>
<style lang="less" scoped>
  .list-img {
    width: 39px;
    height: 39px;
    border-radius: 50%;
    vertical-align: middle;
  }
</style>
